import React, {Component, createRef} from 'react';
import axios from 'axios'

type IProps = {
    updateCurrentState: any
}

class Search extends Component<IProps> {
    keyText = createRef<any>();

    search = (event: any) => {
        let {updateCurrentState} = this.props;
        updateCurrentState({isFirst: false, isLoading: true})
        axios.get(`https://api.github.com/search/users?q=${this.keyText.current.value}`).then(
            response => {
                updateCurrentState({isLoading: false, userList: response.data.items})
            },
            error => {
                updateCurrentState({isLoading: false,err: error.message})
            }
        )
    }

    render() {
        return (
            <section className="jumbotron">
                <h3 className="jumbotron-heading">搜索github用户</h3>
                <div>
                    <input ref={this.keyText} type="text" placeholder="输入名字进行搜索"/>&nbsp;
                    <button onClick={this.search}>搜索</button>
                </div>
            </section>
        );
    }
}

export default Search;